Related #2106

Introducing $$slots

you can use $$slots to determine whether a slot is provided. $$slots is an object, where the keys are the only slot names that are provided and value is true.

for example, if you have a component, Modal,

<Modal>
   <div slot="a">hello</div>
</Modal>

will give you $$slots = { a: true }, while

<Modal>
   <div slot="a">hello</div>
   <div slot="b">world</div>

will give you $$slots = { a: true, b: true }.

You can use it to conditionally render a slot

{#if $$slots.b}
    <div>
         <slot name="b" />
    </div>
{/if}

- can't get the slotted elements at this point, because they are created after instance function.
- A viable alternative is to provide a callback to get the slotted elements after mount.
- the syntax <slot bind:this={slottedElements} /> suggested in #2106 (comment) becomes more natural that way

Before submitting the PR, please make sure you do the following

• It's really useful if your PR relates to an outstanding issue, so please reference it in your PR, or create an explanatory one for discussion. In many cases features are absent for a reason.
• This message body should clearly illustrate what problems it solves. If there are related issues, remember to reference them.
• Ideally, include a test that fails without this PR but passes with it. PRs will only be merged once they pass CI. (Remember to npm run lint!)

Tests

• Run the tests tests with npm test or yarn test)